<template>
  <div>
    <div>
      <van-nav-bar title="生日提醒" left-text="返回" left-arrow @click-left="onClickLeft" />
    </div>
    <van-cell>
      <!-- 使用 title 插槽来自定义标题 -->
      <template #title>
        <span class="custom-title">生日提醒</span>
        <van-tag color="#ffe1e1" text-color="#ad0000">{{len}}</van-tag>
      </template>
    </van-cell>
    <div>
      <van-cell
        v-for="item in items"
        :key="item.time"
        :title="item.content"
        icon="birthday-cake-o"
        :value="timeFormat(item.time)"
      />
    </div>
    <div v-if="len==0">
      <van-empty description="暂无记录" />
    </div>
  </div>
</template>
<script>
import Vue from "vue";
import moment from "moment";
import { NavBar } from "vant";
import { Collapse, CollapseItem } from "vant";
import { Icon } from "vant";
import { Cell, CellGroup } from "vant";
import { Tag } from "vant";
import { Empty } from "vant";

Vue.use(Empty);
Vue.use(Tag);
Vue.use(Cell);
Vue.use(CellGroup);
Vue.use(Icon);
Vue.use(Collapse);
Vue.use(CollapseItem);
Vue.use(NavBar);
export default {
  name: "LastDay",
  data() {
    return {
      activeNames: ["1"],
      items: [],
      len: ""
    };
  },
  created() {
    this.getDiary();
  },
  methods: {
    onClickLeft() {
      this.$router.push("/");
    },
    async getDiary() {
      const { data: res } = await this.$http.get("/api/find/allRemindByType", {
        params: { uid: sessionStorage.getItem('uid'), type: 3 }
      });
      this.items = res.data;
      this.len = this.items.length;
      console.log(res.data);
    },
    timeFormat(date) {
      let date1 = new Date(date);
      // console.log("date", date1);
      // console.log(moment(date).format("YYYY-MM-DD dddd hh:mm:ss"));
      return moment(date).format("YYYY-MM-DD hh:mm:ss");
    }
  }
};
</script>
<style scoped>
</style>